<script lang="ts" setup>
import { ref } from 'vue'
interface updateObj {
  title: string,
  date: string,
  array: string[]
}
const updateArray = ref<updateObj[]>([
  {
    title: "v0.2.0",
    date: "25/3/15",
    array: [
      "[新增][地图]地图组件初始化",
      "[新增][地图]地图组件地名渲染",
      "[新增][地图]地图组件标点渲染",
      "[新增][地图][数据]添加地图地名，标点数据"
    ]
  },
  {
    title: "v0.1.0",
    date: "25/3/8",
    array: [
      "[新增][组件]数据表格添加删除修改",
      "[新增][组件]echart组件初始化",
      "[新增][组件]tree组件添加删除修改",
      "[新增][组件]更新日志模块"
    ]
  },
  {
    title: "v0.0.0",
    date: "25/3/1",
    array: [
      "[新增][系统]router整体跳转逻辑",
      "[新增][view]各模块静态页面"
    ]
  }
])

</script>
<template>
  <el-card>
    <template #header>
      <div class="card-header">
        <span>更新日志</span>
      </div>
    </template>
    <el-collapse>
      <el-scrollbar height="200px">
        <el-collapse-item :title="item.title" v-for="item in updateArray" :key="item.title">
          <template #title>
            <el-text class="mx-1" type="primary" tag="b">{{ item.title }}</el-text>
            <el-text class="mx-1" type="info" style="padding-left: 0.2rem;">{{ item.date }}</el-text>
          </template>
          <li v-for="(li, index) in item.array" :key="index">{{ li }}</li>
        </el-collapse-item>
      </el-scrollbar>

    </el-collapse>
  </el-card>
</template>
<style scoped></style>
